<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<meta content="yes" name="apple-mobile-web-app-capable" />
		<meta content="black" name="apple-mobile-web-app-status-bar-style" />
		<meta content="telephone=no" name="format-detection" />
		<meta content="email=no" name="format-detection" />
		<title></title>
		<link rel="stylesheet" href="../../css/hui.css" />

		<link rel="stylesheet" href="../../css/s_plus.css" />
		<link rel="stylesheet" href="../../css/base.css?time=69" />
		<link rel="stylesheet" href="../../css/layout.css" />
		<link rel="stylesheet" href="../../css/choice.css" />
		<script type="text/javascript" src="../../libs/vue.js"></script>
		<script type="text/javascript" src="../../js/jquery.1.9.1.min.js"></script>
		<script type="text/javascript" src="../../js/app/url.js"></script>
		<script type="text/javascript" src="../../libs/hui.js"></script>
		<script type="text/javascript" src="../../js/app/api.js?time=212"></script>
		<script type="text/javascript" src="../../js/control/pop.js"></script>
		<script type="text/javascript" src="../../js/md5.js"></script>
		<script type="text/javascript" src="../../js/control/swal/sweetalert.min.js"></script>
		<link rel="stylesheet" href="../../js/control/swal/sweetalert.css" />
		<script type="text/javascript" src="../../js/control/select/iosSelect.js"></script>
		<link rel="stylesheet" href="../../js/control/select/iosSelect.css" />
		
		<style>
		
		</style>
	</head>

	<body>
		<div id="app">

			<header class="f_l maxbox subhead">
				<a class="back" @click="back"><i class="iconfont">&#xe605;</i></a>
				<h1>新建工单</h1>
			</header>
			<section class="f_l maxbox edit_list">
				<h3>基础信息</h3>
				<ul>
					<li>
						<b>类别</b>
						<p>

							<select v-model="params.alarmCate">
								<option value="1">一般告警</option>
								<option value="2">严重告警</option>
							</select>
							<!--<input class="edit_txt" v-model="params.alarmCate" name="" type="text" placeholder="请输入">-->
						</p>
					</li>
					<li>
						<b>终端编号</b>
						<p>
							<select v-model="params.zdId">
								<option v-for="item in zdlist" :value="item.TERMIMAL_CODE">{{item.TERMIMAL_CODE}}</option>
							</select>
							<!--<input class="edit_txt" v-model="params.zdId" name="" type="text" placeholder="请输入"></p>-->
					</li>
					<li>
						<b>告警标题</b>
						<p><input class="edit_txt" v-model="params.alarmTitle" name="" type="text" placeholder="请输入"></p>
					</li>

					<li>
						<b>告警内容</b>
						<p> <input class="edit_txt" v-model="params.alarmContent" name="" type="text" placeholder="请输入"></p>
					</li>
					<!--<li>
	      <b>联系人</b>
	      <p><input class="edit_txt" v-model="params.alarmTitle"  name="" type="text" placeholder=""></p>
	    </li>-->
					<li>
						<b>联系电话</b>
						<p><input class="edit_txt" v-model="params.phone" name="" type="number" placeholder="请输入"></p>
					</li>

					<li>
						<b>形成时间</b>
						<p><input readonly="readonly" class="edit_txt" id="xcTime" v-model="params.formationTime" type="datetime"></p>
					</li>
				</ul>
			</section>
			<section class="f_l maxbox mar_t mar_f t_c">
				<a class="btn mian_btn" @click="submitData">提交</a>
			</section>

		</div>

		<script>
			var vm = new Vue({
				el: "#app",
				data: {

					params: {
						zdId: "",
						phone: "",
						formationTime: "",
						channel: "1",
						alarmTitle: "",
						alarmContent: "",
						"companyId.id": "",
						"officeId.id": "",
						alarmCate: "1",
						"contacts.id": ""
					},
					zdlist: [],
					info: "错误提示"
				},
				watch: {
					zdlist(val, oldVal) { //普通的watch监听
						//  console.log("targets: "+val, oldVal);
						this.params.zdId = this.zdlist[0].TERMIMAL_CODE;

					}
				},

				mounted: function() {
					this.params.formationTime= apiManage.getNowFormat();
					loadZDList();

					var companyId = apiManage.getCompanyId();
					var officeId = apiManage.getOfficeId();
					var contactsId = apiManage.getUserid();

					this.params["companyId.id"] = companyId;
					this.params["officeId.id"] = officeId;
					this.params["contacts.id"] = contactsId;

					console.log("新建工单:   " + this.params);
				},

				methods: {
					back: function() {
						window.history.back(-1);
						hui.back();
					},

					submitData: function() {

						if(isEmpty(this.params.alarmCate)) {
							showAlert('告警类别为空');
							//					  		vm.info="告警类别";
							return;
						}



                       if(this.zdlist==null||this.zdlist.length==0){
                       	showAlert('无终端资源');
							return;
                       }
						if(isEmpty(this.params.zdId)) {
							showAlert('终端编号为空');
							//					  		vm.info="终端编号";
							return;
						}

						if(isEmpty(this.params.alarmTitle)) {
							showAlert("告警标题不能为空");
							return;
						}

						if(isEmpty(this.params.alarmContent)) {
							showAlert("告警内容不能为空");
							return;
						}

						if(isEmpty(this.params.phone)) {
							showAlert("联系电话不能为空");
							return;
						}
						
					

						if(!isEmpty(this.params.phone)) {

							var tel = this.params.phone; //获取手机号
							var telReg = !!tel.match(/^(0|86|17951)?(13[0-9]|15[012356789]|17[3678]|18[0-9]|14[57])[0-9]{8}$/);
							//如果手机号码不能通过验证
							if(telReg == false) {
								showAlert('请输入有效的手机号');
								return;
							}
						}

						if(isEmpty(this.params.formationTime)) {
							showAlert("形成时间不能为空");
							return;
						}
						
//							return;
						

						var path = urlManager.addWork();
						console.log(path);
						var username = localStorage.getItem("username");
						var sec = localStorage.getItem("sec_pwd");
						var time = apiManage.getNow();
						var key = "loginName=" + username + "&passWord=" + sec + "&time=" + time;
						console.log(key);
						var paramKey = hex_md5(key);
						
						console.log("key"+paramKey);

						console.log("参数:  " + JSON.stringify(vm.params));


                       hui.loading("信息保存中...");
						$.ajax({
							type: "POST",
							data: vm.params,
							url: path,
							beforeSend: function(request) {
								request.setRequestHeader("loginName", username);
								request.setRequestHeader("time", time);
								request.setRequestHeader("sign", paramKey);

							},
							success: function(result) {
								console.log("工单保存返回============================" + JSON.stringify(result));
								//					
								hui.closeLoading();
								swal({  
										title: "保存成功",
										  text: "",
										  type: "success",
										  showCancelButton: false,
										  confirmButtonColor: "#DD6B55",
										  confirmButtonText: "确认",
										  cancelButtonText: "取消",
										  closeOnConfirm: true,
										  closeOnCancel: false
									},
									function(isConfirm) {  
										if(isConfirm) {
											var type = localStorage.getItem("type");
											if(type=="normal"){
												hui.open("work_list.html?time=" + apiManage.getNow(), {}, true, {});  
											}
											else{
												hui.open("/modules/inspection/inspection.html?time=" + apiManage.getNow(), {}, true, {});  

											}
										} else {  }
									});

							}
						});

					}
				}
			});

			function showAlert(msg) {
				hui.toast(msg);
//				swal("", msg, "warning");

			} 
			//判断字符是否为空的方法
			function isEmpty(obj) {
				if(typeof obj == "undefined" || obj == null || obj == "") {
					return true;
				} else {
					return false;
				}
			}

			//获取终端CODE列表
			function loadZDList() {
				hui.loading("");
				var path = urlManager.terminalList();
				console.log(path);
				var username = localStorage.getItem("username");
				var sec = localStorage.getItem("sec_pwd");
				var time = apiManage.getNow();
				var key = "loginName=" + username + "&passWord=" + sec + "&time=" + time;
				console.log(key);
				var paramKey = hex_md5(key);

				var readyParam = {
					cusId: apiManage.getCompanyId(),
					status: "0"
				};
				console.log("readyParam---------" + JSON.stringify(readyParam));
				
				console.log("params--"+ JSON.stringify({loginName:username,passWord:sec,time: time,sign:paramKey}) );
				$.ajax({
					type: "POST",
					data: readyParam,
					url: path,
					beforeSend: function(request) {
						request.setRequestHeader("loginName", username);
						request.setRequestHeader("time", time);
						request.setRequestHeader("sign", paramKey);
						//		            request.setRequestHeader("Content-Type","application/text");

					},
					success: function(result) {
						hui.closeLoading();
						console.log("终端列表下拉框============================" + JSON.stringify(result));
						vm.zdlist = result.list;

					}
				});

			}

			$(function() {

				//				settingDateControl("startTime");
				//				settingDateControl("endTime");
				settingDateControl("xcTime");

				function settingDateControl(pid) {

					var selectDateDom = $('#' + pid);
					var showDateDom = $('#showDate');
					// 初始化时间
					var now = new Date();
					var nowYear = now.getFullYear();
					var nowMonth = now.getMonth() + 1;
					var nowDate = now.getDate();
					selectDateDom.attr('data-year', nowYear);
					selectDateDom.attr('data-month', nowMonth);
					selectDateDom.attr('data-date', nowDate);
					// 数据初始化
					function formatYear(nowYear) {
						var arr = [];
						for(var i = nowYear - 5; i <= nowYear + 5; i++) {
							arr.push({
								id: i + '',
								value: i + '年'
							});
						}
						return arr;
					}

					function formatMonth() {
						var arr = [];
						for(var i = 1; i <= 12; i++) {

							arr.push({
								id: i + '',
								value: i + '月'
							});
						}
						return arr;
					}

					function formatDate(count) {
						var arr = [];
						for(var i = 1; i <= count; i++) {

							arr.push({
								id: i + '',
								value: i + '日'
							});
						}
						return arr;
					}
					var yearData = function(callback) {
						callback(formatYear(nowYear))
					}
					var monthData = function(year, callback) {
						callback(formatMonth());
					};
					var dateData = function(year, month, callback) {
						if(/^(1|3|5|7|8|10|12)$/.test(month)) {
							callback(formatDate(31));
						} else if(/^(4|6|9|11)$/.test(month)) {
							callback(formatDate(30));
						} else if(/^2$/.test(month)) {
							if(year % 4 === 0 && year % 100 !== 0 || year % 400 === 0) {
								callback(formatDate(29));
							} else {
								callback(formatDate(28));
							}
						} else {
							throw new Error('month is illegal');
						}
					};
					var hourData = function(one, two, three, callback) {
						var hours = [];
						for(var i = 0, len = 24; i < len; i++) {
							if(i < 10) {
								i = "0" + i;
							}
							hours.push({
								id: i,
								value: i + '时'
							});
						}
						callback(hours);
					};
					var minuteData = function(one, two, three, four, callback) {
						var minutes = [];
						for(var i = 0, len = 60; i < len; i++) {
							if(i < 10) {
								i = "0" + i;
							}
							minutes.push({
								id: i,
								value: i + '分'
							});
						}
						callback(minutes);
					};
					selectDateDom.bind('click', function() {
						var oneLevelId = selectDateDom.attr('data-year');
						var twoLevelId = selectDateDom.attr('data-month');
						var threeLevelId = selectDateDom.attr('data-date');
						var fourLevelId = selectDateDom.attr('data-hour');
						var fiveLevelId = selectDateDom.attr('data-minute');
						var iosSelect = new IosSelect(5, [yearData, monthData, dateData, hourData, minuteData], {
							title: '地址选择',
							itemHeight: 35,
							itemShowCount: 9,
							oneLevelId: oneLevelId,
							twoLevelId: twoLevelId,
							threeLevelId: threeLevelId,
							fourLevelId: fourLevelId,
							fiveLevelId: fiveLevelId,
							callback: function(selectOneObj, selectTwoObj, selectThreeObj, selectFourObj, selectFiveObj) {
								selectDateDom.attr('data-year', selectOneObj.id);
								selectDateDom.attr('data-month', selectTwoObj.id);
								selectDateDom.attr('data-date', selectThreeObj.id);
								selectDateDom.attr('data-hour', selectFourObj.id);
								selectDateDom.attr('data-minute', selectFiveObj.id);
								//                  showDateDom.html(selectOneObj.value + ' ' + selectTwoObj.value + ' ' + selectThreeObj.value + ' ' + selectFourObj.value + ' ' + selectFiveObj.value);
								var params = selectOneObj.value + '' + selectTwoObj.value + '' + selectThreeObj.value + '' + selectFourObj.value + '' + selectFiveObj.value;
								console.log(params);
								params = params.replace("年", "-");
								params = params.replace("月", "-");
								params = params.replace("日", " ");
								params = params.replace("时", ":");
								params = params.replace("分", "");
								vm.params.formationTime = params;
							}
						});
					});

				}

			});
		</script>
	</body>

</html>